<template>
	<view class="addArchives" v-if="auditShow">
		<view class="form">
			<view class="sex">
				<view :class="sexnum==1?'sexactive':'boy'" @click="changesex(1)" >
					<view class="icon">
						<uni-icons color="#0b2659"  custom-prefix="iconfont" type="icon-nansheng" size="20"></uni-icons>
					</view>
					<view class="text">
						男生
					</view>
				</view>
				<view :class="sexnum==2?'sexactive':'girl'"   @click="changesex(2)">
					<view class="icon">
						<uni-icons color="#0b2659"  custom-prefix="iconfont" type="icon-nvsheng" size="20"></uni-icons>
					</view>
					<view class="text">
						女生
					</view>
				</view>
			</view>
			<view class="name">
				<view class="title">
					你的姓名
				</view>
				<view class="input-item">
					<view class="left" style="display: flex;align-items: center;">
						<span v-if="!form.masterName">请填写</span>
						<input v-model="form.masterName" type="text"  />
					</view>
					<view class="rights">
						
					</view>
				</view>
			</view>
			<view class="date">
				<view class="title">
					你的生日
				</view>
				<view class="input-item" @click="showCalendar=true">
					<view class="left">
						<span v-if="!celenderValue">请选择</span>
						
						 <span style="font-size: 32rpx;margin-right: 10rpx;">{{celenderValue}}</span>
						 <text v-if="currentIndex==0" style="font-size: 32rpx;">(公历)</text>
						 <text v-if="currentIndex==1" style="font-size: 32rpx;">(农历)</text>
					</view>
					
					<view class="right">
						<e-run-calendar ref="betterCalendarRef" :showCalendar="showCalendar" @confirm="selectDate" :isHourShow="true"
						        @cancel="showCalendar = false" :selectOptions="selectOptionsArr"></e-run-calendar>
					</view>
				</view>
			</view>
			<view class="address">
				<view class="title" >
					出生地点
				</view>
				<view class="input-item" @click="openbrith">
					<view class="left" v-if="!form.masterAddress">
						<span>请选择</span>
						 
					</view>
					<pick-address ref="brithaddress" style="width: 100%;" :width="500" :regionStrs="form.masterAddress" @region="pickaddressChange">
						 
					</pick-address>
					<view class="right">
						
					</view>
				</view>
			</view>
			<view class="now_address">
				<view class="title">
					现居住地址
				</view>
				<view class="input-item" @click="openadresspicker">
					<view class="left" v-if="!form.nowAddress">
						<span >请选择</span> 
					</view>
					<pick-address ref="nowaddress" style="width: 100%;" :width="500" :regionStrs="form.nowAddress" @region="pickaddressChange2">
						 
					</pick-address>
					 
					<view class="right" >
						
					</view>
				</view>
			</view>
			
			<view class="next_state">
				<view class="button" v-if="!isEdit" @click="addSubmit">
					保存档案
				</view>
				<view class="edit_de" v-else>
					<view class="button_edit" @click="changeSubmit">
						确认修改
					</view>
					<view class="button_delete" @click="opendialog">
						删除档案
					</view>
				</view>
			</view>
		</view>
		
		<uni-popup ref="alertDialog" type="dialog">
						<uni-popup-dialog :type="msgType" cancelText="取消" confirmText="确认" title="提示" content="是否确认删除该条数据" @confirm="deleteArchives"
							@close="dialogClose"></uni-popup-dialog>
					</uni-popup>
	
	</view>
</template>

<script>
	import pickAddress from '@/components/picker-address/picker-address.vue'
	import pickTimes from '@/components/picker-times/picker-times.vue'
	import eRunCalendar from "@/uni_modules/e-run-calendar/components/e-run-calendar/e-run-calendar.vue"
	export default{
		components:{pickAddress,pickTimes,eRunCalendar},
		data(){
			return{
				auditShow:false,
				form:{
					masterName:'',
					masterSex:'男',
					masterBirthday:'',
					masterAddress:'',
					masterAddressCode:'',
					masterAddressLatitude:'',//出生地经纬度
					masterTime:'',
					isLeap:null,
					isDaylight:false,
					nowAddress: "", //现居地
					nowAddressLatitude: "", //现居地经纬度
					birthTimeZone: "东8区" //出生时区
					
				},
				currentIndex:0,//0 阳历  1农历 
				isEdit:false,
				isBendi:'',
				rangelist:['东8区','东7区','东6区','东5区','东4区'],
				showCalendar: false,//是否显示组件
				celenderValue: '',//选择值
				selectOptionsArr: [80, 0, 0, 0],///起始年份
				sexnum:1,
			}
		},
		onLoad(options){
			if ('params' in options) {
			      let obj = JSON.parse(decodeURIComponent(options.params));
				  console.log(obj);
				  this.isEdit=true
				  uni.setNavigationBarTitle({
				    title: "编辑档案"
				  })
				  this.form.masterName=obj.masterName
				  this.form.masterSex=obj.masterSex
				  this.form.masterSex=='男'?this.sexnum=1:this.sexnum=2
				  this.form.masterBirthday=obj.masterBirthday
				  this.form.masterAddress=obj.masterAddress
				  this.form.masterAddressCode=obj.masterAddressCode
				  this.form.isLeap=obj.isLeap
			      this.form.masterInfoId=obj.masterInfoId
			      this.form.nowAddress=obj.nowAddress
			      this.form.nowAddressLatitude=obj.nowAddressLatitude
			      this.form.masterAddressLatitude=obj.masterAddressLatitude
			      this.form.isDaylight=obj.isDaylight
			      this.form.birthTimeZone=obj.birthTimeZone
				 this.celenderValue=obj.masterBirthday
				  if(this.form.isLeap=='false' || this.form.isLeap=='true' ){
					  this.currentIndex=1
				  }
				  this.form.masterAddressCode=obj.masterAddressCode
			 }
		},
		onShow(){
			this.getAudit()
		},
		methods:{
			getAudit(){
			    let param = {};
				param.url='v3/system/front/configuration/1'
				this.$request(param).then(res=>{
					console.log(res);
					this.auditShow=res.data.auditSwitch
					
				})
			},
			changesex(val){
				this.sexnum=val
				if(val==1){
					this.form.masterSex='男'
				}else if(val==2){
					this.form.masterSex='女'
				}
			},
			selectDate(e){
				console.log('e',e);
				if(e.type == 'solar'){
					//公历
					this.currentIndex=0
					this.form.isLeap=null
					this.form.masterBirthday=e.year+'/'+e.month+'/'+e.day+'/'+' '+(e.hour+1).toString().padStart(2, '0')+":"+'00'
				    this.celenderValue=this.form.masterBirthday
				}else if(e.type == 'lunar'){
					//农历
					this.currentIndex=1
					this.form.masterBirthday=e.year+'/'+e.month+'/'+e.day+'/'+' '+(e.hour+1).toString().padStart(2, '0')+":"+'00'
					//判断是否闰月
					this.form.isLeap= e.leap_month == 1 ? 'true':'false'
					this.celenderValue=this.form.masterBirthday
				}
				console.log('this.form.masterBirthday',this.form.masterBirthday);
				this.showCalendar=false
			},
			opendialog(){
				this.$refs.alertDialog.open()
			},
			dialogClose(){
				this.$refs.alertDialog.close()
			},
			/* 删除操作 */
			deleteArchives(){
				if(this.form.masterInfoId=='本地'){
					uni.removeStorageSync('exampleInfo')
					this.$refs.alertDialog.close()
					this.$modal.msg('删除成功!')
					setTimeout(()=>{
						this.$tab.navigateBack()
					},1000)	
				}else{
					//
					let param={}
					param.url='v3/member/front/master/delete'
					param.data={
						masterInfoId: this.form.masterInfoId
					}
					param.method="GET"
					param.header={
						'Content-Type': 'application/json'
					},
					
					this.$request(param).then(res=>{
						console.log(res);
						if(res.state==200){
							this.$refs.alertDialog.close()
						  this.$modal.msg('删除成功!')
					      setTimeout(()=>{
							  this.$tab.navigateBack()
						  },1000)					
						}else{
							this.$modal.msg(res.msg)
						}
					})
				}
			},
			/* 修改操作 */
			changeSubmit(){
				if(this.form.masterInfoId=='本地'){
					uni.removeStorageSync('exampleInfo')
					uni.setStorageSync('exampleInfo',this.form)
					this.$modal.msg('修改成功!')
					setTimeout(()=>{
						this.$tab.navigateBack()
					},1000)	
				}else{
					if(!this.form.masterName){
						this.$modal.msg('请输入姓名')
						return false
					}else if(!this.form.masterBirthday){
						this.$modal.msg('请选择时间')
						return false
					}
					// else if(!this.form.masterAddressCode){
					// 	this.$modal.msg('请选择地址')
					// 	return false
					// }
					
					let param={}
					param.url='v3/member/front/master/update'
					param.data=this.form
					param.method="POST"
					param.header={
						'Content-Type': 'application/json'
					},
					
					this.$request(param).then(res=>{
						console.log(res);
						if(res.state==200){
						  this.$modal.msg('修改成功!')
					      setTimeout(()=>{
							  this.$tab.navigateBack()
						  },1000)					
						}else{
							this.$modal.msg(res.msg)
						}
					})
				}
			},
			async  pickaddressChange(value){
				console.log('value',value);
				this.form.masterAddress=value[0].name+value[1].name+value[2].name
				this.form.masterAddressCode=value[2].code
				
                let result = await this.$getAddressLocation(this.form.masterAddress)
				this.form.masterAddressLatitude=result.lng+","+result.lat
			},
			async  pickaddressChange2(value){
				this.form.nowAddress=value[0].name+value[1].name+value[2].name
				
			    let result = await this.$getAddressLocation(this.form.nowAddress)
				this.form.nowAddressLatitude=result.lng+","+result.lat
				console.log(this.form.nowAddressLatitude);
			},
			changeSex(sex){
				this.form.masterSex=sex==0 ? '男':'女';
			},
			changeCurrent(current){
				this.currentIndex=current
				if(current==0){
					this.form.isLeap=null
				}else{
					this.form.isLeap=false
				}
			},
			pickChangeTime(time){
				// console.log(time);
				this.form.masterBirthday=time
			},
			addSubmit(){
				this.$request({url:'v3/member/front/master/detail'}).then(res=>{
					if(!res.data){
						// 没有档案信息   添加并选中
						this.form.isSelect=true
					}
				// console.log(this.form);
				
				if(!this.form.masterName){
					this.$modal.msg('请输入姓名')
					return false
				}else if(!this.form.masterBirthday){
					this.$modal.msg('请选择时间')
					return false
				}
				
				let param={}
				param.url='v3/member/front/master/add'
				param.data=this.form
				param.method="POST"
				param.header={
					'Content-Type': 'application/json'
				},
				
				this.$request(param).then(res=>{
				 
					if(res.state==200){
					  this.$modal.msg('新增成功!')
					  uni.removeStorageSync('exampleInfo')
                      setTimeout(()=>{
						  this.$tab.navigateBack()
					  },1000)					
					}else{
						this.$modal.msg(res.msg)
					}
				})
				
				})
			},
			SwitchSex(e) {
				console.log(e.detail.value);
			    this.form.isDaylight = e.detail.value
			},
			timeZoneChange(e){
				console.log(e.detail.value);
				this.form.birthTimeZone=this.rangelist[e.detail.value]
			},
			daylightFn(){
				this.$refs.daylight.open()
			},
			daylightClose(){
				this.$refs.daylight.close()
			},
		}
	}
</script>

<style lang="scss" scoped>
	page{
		background-color: #fff;
	}
	.addArchives{
		.form{
			background-color: #fff;
			padding: 30rpx 40rpx;
			// border-radius: 20rpx 20rpx 0 0;
			 border-top: 2rpx solid #cecece;
		// box-shadow: 2rpx 0rpx 0rpx 0rpx rgba(0, 0, 0, .1);
			.sex{
				display: flex;
				justify-content: space-between;
				.boy,.girl{
					width: 250rpx;
					height: 80rpx;
					padding: 0 50rpx;
					line-height: 80rpx;
					background-color: #f2f2f2;
					border-radius: 40rpx;
					display: flex;
					justify-content: space-between;
					align-items: center;
					.icon{
						width: 60rpx;
						height: 60rpx;
						line-height: 60rpx;
						// padding: 10rpx;
						border-radius: 50%;
						background: #fff;
						text-align: center;
						
					}
					.text{
						font-size: 28rpx;
						font-weight: 550;
					}
				}
				.sexactive{
					width: 250rpx;
					height: 80rpx;
					padding: 0 50rpx;
					line-height: 80rpx;
					background-color: #87CEEB;
					border-radius: 40rpx;
					display: flex;
					justify-content: space-between;
					align-items: center;
					.icon{
						width: 60rpx;
						height: 60rpx;
						line-height: 60rpx;
						// padding: 10rpx;
						border-radius: 50%;
						background: #fff;
						text-align: center;
						
					}
					.text{
						font-size: 28rpx;
						font-weight: 550;
						color: #FFFFFF;
					}
				}
			}
			.name,.date,.address,.now_address{
				margin-top: 20rpx;
				.title{
					font-size: 24rpx;
					color: #989898;
				}
				.input-item{
					margin-top: 10rpx;
					 height: 100rpx;
					 line-height: 100rpx;
					 border-radius: 20rpx;
					background-color: #f2f2f2;
					color: #989898;
					display: flex;
					justify-content: space-between;
					align-items: center;
					padding: 0 30rpx;
					 .left{
						 width: 100%;
					 }
					.right{
						  width: 0;
						  height: 0;
						  border-left: 12rpx solid transparent;
						  border-right: 12rpx solid transparent;
						  border-top: 12rpx solid #989898;
					}
				}
			}
			.next_state{
				width: 100%;
			margin-top: 80rpx;
				.button{
					width: 400rpx;
					height: 80rpx;
					line-height: 80rpx;
					background-color:  #90e7ff;
					margin: 0 auto;
					text-align: center;
					border-radius: 40rpx;
					
				}
				
				.edit_de{
					display: flex;
					.button_edit{
						width: 300rpx;
						height: 80rpx;
						line-height: 80rpx;
						background-color:  #87CEEB;
						margin: 0 auto;
						text-align: center;
						border-radius: 40rpx;
						font-size: 26rpx;
						font-weight: 550;
						color: #fff;
					}
					.button_delete{
						width: 300rpx;
						height: 80rpx;
						line-height: 80rpx;
						border: 2rpx solid #ff2b2b;
						margin: 0 auto;
						text-align: center;
						border-radius: 40rpx;
						color: #ff2b2b;
						font-size: 26rpx;
						font-weight: 550;
					}
				}				
			}
		}
	}

</style>